<template>
  <div>


    <section class="aui-scrollView">
      <div class="aui-quarter-box">
        <div class="aui-flex">
          <div class="aui-flex-box">
            <h2>{{userInfo.docname}}</h2>
            <h3>科室：{{userInfo.ks || '-'}}</h3>
          </div>
          <div class="aui-flex-img">
            <img src="image/yisheng.png" alt>
          </div>
        </div>
      </div>
    </section>


    <section class="cgzl">

      <!-- 医生简介信息，是否可以医生自定义???? -->
      <!--
      <mt-field
        label="医生简介"
        placeholder="请输入"
        type="textarea"
        rows="4"
        autofocus
        :style="{background:(iseidt?'':'#f6f6f6')}"
        v-model="ysjj"
        :readonly="iseidt"
      ></mt-field>
      <p class="editzl" v-if="iseidt==true" @click="iseidt=false">修改</p>
      <p class="editzl" v-else @click="doChange">保存</p> -->

      <div>
        <div>{{ysjj}}</div>
        <div>{{ysjj_content}}</div>
      </div>


    </section>


    <div class="zyclass">
      <section>
        <h5>关注医生请扫描二维码</h5>
        <!--
          <p>
            <barcode :value="barcode_value" :options="barcode_option" tag="svg"></barcode>
          </p>
        -->
        <div class="barcode-color-box">
          <div class="QrCodeTicketUrl">
            <img :src="docQrcodeUrl">
          </div>
        </div>
      </section>
    </div>


    <SiteFooter/>

  </div>
</template>
<script>
import headTop from '~/components/pagetwo/headTop';
import barcode from '@xkeshi/vue-barcode';

import SiteFooter from '~/components/layout/SiteFooter.vue';

const { config } = window;

export default {
  components: {
    headTop,
    barcode,
    SiteFooter,
  },
  data() {
    return {
      ysjj: '医生简介',
      ysjj_content: '-',
      iseidt: true,
      balance: 0,
      userInfo: {},
      ts: this.newStore(),
      appId: '',
      timestamp: '',
      nonceStr: '',
      signature: '',
      docQrcodeUrl: '',
    };
  },
  created() {
    document.title = '我的';
    this.userInfo = JSON.parse(localStorage.getItem(`userInfo.${config.LT}`));
  },
  methods: {
    doChange() {
      this.iseidt = true;
      const res = JSON.stringify({
        OTRequest: {
          VERSION: '1.0',
          TN: 'F27.APP.01.28',
          CLIENTID: 'YLAPP',
          RYBID: 'DOCTOR',
          TOKEN: `${sessionStorage.getItem('rybToken')}`,
          DATA: {
            ysjj: this.ysjj,
          },
        },
      });
      console.log(res);
      // return;

      this.spost(this.ts, '/doctor/AppMainServlet.ap', {
        '': res,
      }).then(() => {
        this.showAlert = true;
        this.alertText = '修改成功！';
      });
    },

    getDocQrCode() {
      const regUrl = `/doctor/WeixinLogin.lg?reqType=doc.qrcode&lt=${config.LT}&docid=${this.userInfo.userid}&sid=${config.hosInfo.SID}`;

      this.spost(this.ts, regUrl).then((ts) => {
        if (ts.d.errCode == '200') {
          console.info(ts.d.extReturn.qrurl);
          this.docQrcodeUrl = ts.d.extReturn.qrurl;
        } else {
          // 发布到项目中时使用自定义的弹窗
          this.$messagebox('提示', `失败：${ts.d.errMessage}`);
        }
      });
    },
  },
  mounted() {
    this.getDocQrCode();
  },
};
</script>
<style>
* {
  margin: 0;
  padding: 0;
}
.mint-cell-wrapper{
  font-size: 1rem;
}
.mint-field-core{
  padding: 3px
}
.cgzl {
  margin: 0.2rem 0;
  padding: 15px;
}
.cgzl div div:nth-child(1) {
  margin-bottom: .5rem;
}
.cgzl div div:nth-child(2) {
  color: #606266;
  font-size: .5rem;
}
.editzl {
  background: #26a2ff;
  margin: 0;
  padding: 0.2rem 1rem;
  color: #fff;
  text-align: right;
}

.zyclass {
  text-align: center;
  width: 100%;
  background-color: #fff;
}
.QrCodeTicketUrl {
  width: 100%;
  /*   position:inherit;
  height: 100%;
  padding-top: 100%; */
}
.QrCodeTicketUrl img {
  display: inline-block;
  top: 0;
  left: 0;
  width: 50%;
  /* height: 50%; */
}
.buttonSM {
  display: inline-block;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  background: #7078ec;
  border: 1px solid #dcdfe6;
  border-color: #dcdfe6;
  color: #fff;
  -webkit-appearance: none;
  text-align: center;
  box-sizing: border-box;
  outline: none;
  margin: 0;
  transition: 0.1s;
  font-weight: 500;
  padding: 12px 20px;
  font-size: 14px;
  border-radius: 4px;
  margin-bottom: 1rem;
}
.aui-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  padding: 15px;
  position: relative;
}

.aui-flex-box {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  flex: 1;
  min-width: 0;
  font-size: 14px;
  color: #333;
}

/* 蹇呰甯冨眬鏍峰紡css */

.aui-flexView {
  padding-top: 5rem;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  background: #26a2ff
}

.aui-scrollView {
  width: 100%;
  height: 100%;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  position: relative;
  background: #26a2ff;
}

.aui-quarter-box {
  background-image: url("/image/head-bg.png");
  background-size: cover;
}

.aui-flex-img {
  width: 80px;
  height: 80px;
}

.aui-flex-img img {
  width: 80px;
  height: 80px;
  /* border: 5px solid #fff; */
  border-radius: 100%;
}

.aui-flex-box h2 {
  color: #fff;
  font-weight: bold;
  margin-bottom: 0.2rem;
  font-size: 1.2rem;
}

.aui-flex-box h3 {
  border-radius: 3px;
  color: #fff;
  font-weight: normal;
  font-size: 0.85rem;
  padding: 4px 0;
}
</style>
